﻿/**animation*/
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  animation-fill-mode: both;
  -webkit-animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

/**move(移动)***/
.move{
	animation-name:move;
	-webkit-animation-name:move;
}
@keyframes move{
	0%{right:-340px;opacity:0;}
	100%{right:50px;opacity:1;}
}
@-webkit-keyframes move{
	0%{right:-340px;opacity:0;}
	100%{right:50px;opacity:1;}
}
@-moz-keyframes move{
	0%{right:-340px;opacity:0;}
	100%{right:50px;opacity:1;}
}
@-o-keyframes move{
	0%{right:-340px;opacity:0;}
	100%{right:50px;opacity:1;}
}

/***plus(放大缩小)****/
.pulse{
	animation-name:pulse;
	-webkit-animation-name:pulse;
}
@keyframes pulse{
	0%{transform:scale(1,1);-webkit-transform:scale(1,1);opacity:1;}
	50%{-webkit-transform:scale(1.1,1.1);transform:scale(1.1,1.1);opacity:0.8;}
	100%{-webkit-transform:sclae(1,1);transform:sclae(1,1);opacity:1;}
}
@-webkit-keyframes pulse{
	0%{transform:scale(1,1);-webkit-transform:scale(1,1);opacity:1;}
	50%{-webkit-transform:scale(1.1,1.1);transform:scale(1.1,1.1);opacity:0.8;}
	100%{-webkit-transform:sclae(1,1);transform:sclae(1,1);opacity:1;}
}
@-moz-keyframes pulse{
	0%{transform:scale(1,1);-moz-transform:scale(1,1);opacity:1;}
	50%{-moz-transform:scale(1.1,1.1);transform:scale(1.1,1.1);opacity:0.8;}
	100%{-moz-transform:sclae(1,1);transform:sclae(1,1);opacity:1;}
}
@-o-keyframes pulse{
	0%{transform:scale(1,1);-o-transform:scale(1,1);opacity:1;}
	50%{-o-transform:scale(1.1,1.1);transform:scale(1.1,1.1);opacity:0.8;}
	100%{-o-transform:sclae(1,1);transform:sclae(1,1);opacity:1;}
}

/*transition 的旋转**/
.img_rotate.active{
	transition:transform 0.2s linear;
	transition:-ms-transform 0.2s linear;
	-webkit-transition:-webkit-transform 0.2s linear;
	-moz-transition:-moz-transform 0.2s linear;
	-o-transition:-o-transform 0.2s linear;
	transform:rotate(180deg);
	-webkit-transform:rotate(180deg);
	-moz-transform:rotate(180deg);
	-o-transform:rotate(180deg);
	display:inline-block;
}

/***slide***/
.input_rg{
	-webkit-animation-duration: 0.5s;
	animation-duration: 0.5s;
	animation-name:slide;
	-webkit-animation-name:slide;
	animation-timing-function:ease;
	-webkit-animation-timing-function:ease;
}
@keyframes slide{
	0%{width:0%;}
	100%{width:75%;}
}
@-webkit-keyframes slide{
	0%{width:0%;}
	100%{width:75%;}
}
@-moz-keyframes slide{
	0%{width:0%;}
	100%{width:75%;}
}
@-o-keyframes slide{
	0%{width:0%;}
	100%{width:75%;}
}
